<html>
  <head>
    <meta charset="utf-8" />
    <link
      rel="stylesheet"
      href="static/assets/global/plugins/bootstrap/css/bootstrap.min.css"
      type="text/css"
    />
    <link
      rel="stylesheet"
      href="static/assets/global/css/components.css"
      type="text/css"
    />
    <link
      rel="stylesheet"
      href="static/assets/admin/pages/css/login.css"
      type="text/css"
    />
    <script
      src="static/assets/global/plugins/jquery-1.11.0.min.js"
      type="text/javascript"
    ></script>
  </head>

  <body class="login">
    <div class="content">
      <h3 class="form-title">获取otp信息</h3>

      <div class="form-group">
        <label class="control-label">手机号</label>
        <div>
          <input
            class="form-control"
            type="text"
            placeholder="请输入手机号"
            name="telphone"
            id="telphone"
          />
        </div>
      </div>

      <div class="form-actions">
        <button class="btn blue" id="getotp" type="submit">
          获取otp短信
        </button>
      </div>
    </div>
  </body>

  <script>
    jQuery(document).ready(function () {
      //绑定otp的click事件，用于向后端发送获取手机验证码的请求
      $("#getotp").on("click", function () {
        var telphone = $("#telphone").val();
        if (telphone == null || telphone == "") {
          alert("手机号不能为空");
          return false;
        }
        $.ajax({
          type: "POST",
          contentType: "application/x-www-form-urlencoded",
          url: "http://localhost:8080/user/getotp",
          //以上是ajax请求头
          data: { telphone: $("#telphone").val() },
          crossDomain: true,
          xhrFields: { withCredentials: true },
          success: function (data) {
            if (data.status == "success") {
              alert("otp已经发送到了您的手机上，请注意查收");
              window.location.href =
                "C:/Users/86188/Desktop/秋招/简历项目/电商秒杀项目/register.html";
            } else {
              alert("otp发送失败，原因是" + data.data.errMsg);
            }
          },
          error: function (data) {
            alert("otp发送失败，原因是" + data.responseText);
          },
        });
        return false;
      });
    });
  </script>
</html>
